<!DOCTYPE html>
<html lang="pl">
<head>
  <title>po-drodze.pl</title>

  <!-- meta -->
  <meta charset="utf-8">
  <meta name="author" content="Mikołaj Cankudis, Konrad Szychowiak">
  <meta name="application-name" content="po-drodze.pl">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <!-- links -->
  <link rel="shortcut icon" href="/assets/img/favicon.png">
  <!-- <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Merriweather+Sans"> -->
  <!-- <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"> -->
  <!-- for prototype styling only -->
  <link rel="stylesheet" href="/assets/styles/w3.css">
  <link rel="stylesheet" href="/assets/styles/icons.css">
  <link rel="stylesheet" href="/assets/styles/home.styl">
  <link rel="stylesheet" href="/assets/styles/core.styl">

  <!-- scripts -->
  <!-- <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> -->
</head>

<body>

  <!-- welcome screen -->
  <section id="landing" class="view">
    <div id="landing__menu" class="landing__menu" class="menu">
      <img src="/assets/img/icon-stable.png" alt="podrodze.pl">
      <p class="title"><b>po</b>drodze</p>

      <form action="/map" method="get">
        <input  class="menu__input"  type="text" name="start" value="" placeholder="punkt startowy">
        <input  class="menu__input"  type="text" name="stop" value="" placeholder="cel podróży">
        <button class="menu__button" type="submit">w drogę!</button>
      </form>
    </div>

    <div class="w3-display-bottommiddle w3-text-white w3-opacity-max w3-padding-32">
      <a href="#info">
        <i id="learn" class="w3-jumbo icon-down"></i>
      </a>
    </div>
  </section>


  <!-- about section with description versions -->
  <section id="about" class="view">

    <!-- app description -->
    <div id="about__descr">
      <p class="about__icon w3-center">
        <i class="icon-info w3-jumbo"></i>
        <br>
        <b class="w3-xlarge">O aplikacji</b>
      </p>

      <p class="w3-large w3-justify">
        <b>PoDrodze</b> to darmowa apilkacja internetowa, której głównym celem jest pomoc użytkownikowi w odnalezieniu ciekawych miejsc, które mógłby odwiedzić planując swoją podróż.
        Dane są czerpane z domeny publicznej, a generowana trasa może być modyfikowana i zmieniana, by jak najlepiej sprostać wymaganiom użytkownika.
        Zaplanuj trasę dodając i usuwając przystanki, a na końcu otwórz ją w mapach Google aby rozpocząć nawigację. Cała trasa będzie na bieżąco optymalizowana, a w orientacji i nawigacji
        pomoże Ci prosty panel boczny.
      </p>
    </div>

    <!-- standard build: from `master` branch -->
    <div class="side">
        <img class="side__logo" src="/assets/img/logo-stable.png" alt="">
        <p class="w3-large w3-justify">
          <em> <strong>PoDrodze</strong> Stable Build</em> to aktualna, stabilna wersja, której możesz zaufać.
          Znajdziesz tu sprawdzone i w pełni działające funkcje, które pozwolą Ci na przyjemne i efektywne korzystanie z naszej aplikacji.

          <br>

          Ze strony technicznej: jest to wersja zbudowana z najnowszego wydania na gałęzi <code>master</code> w naszym repozytorium.
        </p>
        <div class="side__content">
          <button class="menu__button">
            w drogę!
          </button>
        </div>
    </div>

    <!-- nightly build: from `develop` branch -->
    <div class="side">
        <img class="side__logo" src="assets/img/logo-nightly.png" alt="">
        <div class="side__content">
          <p class="w3-large w3-justify">
            <em> <strong>PoDrodze</strong> Nightly Build</em> to wersja, która pozwoli Ci odkryć wszystkie najnowsze funkcje aplikacji zanim trafią one do właściwego wydania.
            Pamiętaj jednak, że odbywa się to kosztem stabilności i nie wszystkie funkcje będą pełne i dopracowane.

            <br>

            Ze strony technicznej: jest to wersja zbudowana z bierzącego stanu gałęzi <code>develop</code> w naszym repozytorium.
          </p>
          <button class="menu__button--blue">
            odkrywaj!
          </button>
        </div>
    </div>
  </section>



  <!-- TODO: how to: app description -->
  <section id="how-to" class="view dark">

    <header class="w3-center">
      <i class="icon-help w3-jumbo"></i>
      <br>
      <b class="w3-xlarge">Jak to działa?</b>
    </header>

    <div class="how-tos">
      <!-- choosing endpoints -->
      <div class="how-to">
        <div class="how-to__icon"><i class="icon-play"></i></div>
        <div class="how-to__name">Wybierz punkt startu</div>
      </div>

      <div class="how-to">
        <div class="how-to__icon"><i class="icon-target"></i></div>
        <div class="how-to__name">Wybierz punkt docelowy</div>
      </div>

      <div class="how-to">
        <div class="how-to__icon"><i class="icon-code"></i></div>
        <div class="how-to__name">Wybierz odległość szukania</div>
      </div>

      <!-- choosing endpoints -->
      <div class="how-to">
        <div class="how-to__icon"><i class="icon-db"></i></div>
        <div class="how-to__name">Dostosuj źródła danych</div>
      </div>

      <div class="how-to">
        <div class="how-to__icon"><i class="icon-pin"></i></div>
        <div class="how-to__name">Przejżyj listę znalezionych miejsc</div>
      </div>

      <div class="how-to">
        <div class="how-to__icon"><i class="icon-add"></i></div>
        <div class="how-to__name">Dodaj miejsca do swojej listy</div>
      </div>

      <!-- choosing endpoints -->
      <div class="how-to">
        <div class="how-to__icon red"><i class="icon-package"></i></div>
        <div class="how-to__name">Przygotuj własną trasę</div>
      </div>

      <div class="how-to">
        <div class="how-to__icon red"><i class="icon-share"></i></div>
        <div class="how-to__name">Podziel się ze znajomymi</div>
      </div>

      <div class="how-to">
        <div class="how-to__icon"><i class="icon-ext"></i></div>
        <div class="how-to__name">Przeglądaj także w zewnętrznych aplikacjach</div>
      </div>

    </div>
  </section>



  <section id="roadmap" class="view">
    <header class="w3-center">
      <i class="icon-alert w3-jumbo"></i>
      <br>
      <b class="w3-xlarge">Nowości</b>
    </header>

    <div id="features" class="view-container w3-panel">

      <div class="features--current">
        <div><i class="icon-check"></i></div>
        <div>Nowy projekt strony powitalnej</div>
      </div>

      <div class="features--incoming">
        <div><i class="icon-clock"></i></div>
        <div>Nowy projekt strony obsługi trasy</div>

        <div><i class="icon-clock"></i></div>
        <div> Integracja z nowymi danymi</div>

        <div><i class="icon-clock"></i></div>
        <div> Dodanie tłumaczeń </div>

        <div><i class="icon-clock"></i></div>
        <div> Nowe opcje edycji trasy </div>

        <div><i class="icon-clock"></i></div>
        <div> Dodanie możliwości tworzenia i zarządzania kontami </div>

        <div><i class="icon-clock"></i></div>
        <div> Dodanie opcji «ulubione» </div>

        <div><i class="icon-clock"></i></div>
        <div> Poprawa informacji dla użytkownika </div>
      </div>
    </div>
  </section>



  <section id="tech" class="view dark">
    <div class="tech">
      <div id="mikolaj" class="tech__field">
        <i class="icon-code"></i>
        <p><strong> Mikołaj Cankudis </strong></p>
        <em> BackEnd Developer </em>
        <a class="tech__button" href="mailto:mikolaj@cankudis.net?subject=feedback"><i class="icon-mail"></i> email</a>
      </div>

      <div id="konrad" class="tech__field">
        <i class="icon-code"></i>
        <p><strong> Konrad Szychowiak </strong></p>
        <em> FrontEnd Developer </em>
        <a class="tech__button" href="mailto:konrad.szychowiak@gmail.com?subject=feedback"><i class="icon-mail"></i> email</a>
      </div>

      <div id="danegov" class="tech__field">
        <i class="icon-db"></i>
        <p><strong> dane.gov.pl </strong></p>
        <em> Dane publiczne </em>
        <a class="tech__button" href="https://dane.gov.pl/"><i class="icon-link"></i> link</a>
      </div>

      <div id="googlemaps" class="tech__field">
        <i class="icon-cpu"></i>
        <p><strong> Google Maps API </strong></p>
        <em> Dostawca map i generatora tras </em>
        <a class="tech__button" href="https://cloud.google.com/maps-platform/"><i class="icon-link"></i> link</a>
      </div>

      <div id="gitlab" class="tech__field">
        <i class="icon-gitlab"></i>
        <p><strong> GitLab </strong></p>
        <em> Repozytorium projektu </em>
        <a class="tech__button" href="https://gitlab.com/podrodze/po-drodze/"><i class="icon-link"></i> link</a>
      </div>
    </div>

  </section>

  <!-- <script src="scripts/latest.js" charset="utf-8"></script> -->
</body>
</html>
